@charset "utf-8";
@import "main.less";
body{.padding_Remove;.margin_Remove;background: @bodyColor;}
.a_removeStyle();
ul li{.ul_BaseStyle;}
a{text-decoration: none;}
@media all and (min-width:1367px) {
  .icon_good{background: url(../img/good.png) left center no-repeat;display:inline-block;.size(16px,16px);vertical-align: middle;}
  .icon_watch{background: url(../img/watch.png) left center no-repeat;display: inline-block;.size(16px,16px);vertical-align: middle;}
  .icon_comment{background: url(../img/comment.png) left center no-repeat;display: inline-block;.size(16px,16px);vertical-align: middle;}
  .icon_light{background: url(../img/light.png) left center no-repeat;display: inline-block;.size(16px,16px);vertical-align: middle;}
  .icon_mark{background: url(../img/mark.png) left center no-repeat;display: inline-block;.size(16px,16px);vertical-align: middle;}
  .icon_test{background: url(../img/test.png) left center no-repeat;display: inline-block;.size(16px,16px);vertical-align: middle;}
  .icon_activity{background: url(../img/activity.png) left center no-repeat;display: inline-block;.size(16px,16px);vertical-align: middle;}

  .icon_refresh{background:url(../img/refresh.png) left center no-repeat;.size(20px,20px);vertical-align: middle;}
  .icon_survey{background:url(../img/survey.png) left center no-repeat;.size(20px,20px);vertical-align: middle;}
  .icon_news{background:url(../img/news.png) left center no-repeat;.size(20px,20px);vertical-align: middle;}

  //重用性标题
  .header_title{font-weight:700;border-left:5px solid @font_blue;padding-left: 5px;display: flex;}
  //清除左边框,保留下边框
  .clear_border_left{border-left: 0px;}
  //一般字体
  .font_normal{font-weight:normal;}

  .header_title h1{font-size:20px;.margin_Remove;line-height:40px;color:@titleColor;}
  //标题带刷新按钮样式
  //刷新左部
  .header_title .title_left{font-size:20px;.margin_Remove;line-height:40px;flex:1;
    //选取第一个相邻标签的伪类
    &+a:hover{
      span{
        color: @font_blue;
      }
    }
    //选取第二个相邻标签的伪类
    &+a+a:hover{
      span{
        color: @font_blue;
      }
    }
  }
  //刷新右部A
  .header_title .title_right{font-size:14px;.margin_Remove;height:20px;color:@infoColor;
    flex:1;.margin(10px 5px);

    & span{display: block;float: left;
      &:hover{color: @font_blue;}
    }
  }


  //模块选项卡
  .tab_controller ul{.padding_Remove;.margin_Remove;}
  .tab_controller li{display: inline-block;.margin_left(20px);
    & a{display: block;color: @titleColor;}
  }
  //选项卡选中的样式
  .act{border-bottom: 3px solid @font_blue;}

  .hide{display:none;}
  #tab_t .act{ position:relative;}


  //主体宽度设置
  .index_body{.margin_Auto;.size(1200px,auto);}
  //搜索模块
  .body_search{float: left;text-align: center;.margin(44px,25%);.margin_top(90px);}
  //包裹着搜索框跟搜索按钮的稳定布局span
  .search_span{float: left;}
  //搜索框
  .search_text{.size(450px,34px);.radius();.padding(0px,16px);border: 1px solid @font_blue;float: left;}
  //搜索按钮
  .search_btn{.radius();.btn_default(fill,88px,36px);}
  //广告推荐图
  .advertisimg img{.size(1200px,auto);margin-bottom: 15px;float: left;}
  //左部设置
  .body_main{.size(820px,auto);float: left;}

  //一周热文
  .posters_post{.size(820px,290px);float: left;}
  //海报
  .posters{.size(495px,290px);float: left;.card(0,0);.padding_Remove;background:#67D5B5;}
  //一周热文
  .hot_article{.size(275px,260px);.card(0,0);.padding_Remove;.padding(15px,17.5px);.radius();float: left;margin-left:15px;overflow: hidden;}
  //热文主体
  .article_body{.size(245px,215px);.padding(10px,10px)}
  //热文主体里面的列表样式
  .article_body ul{.padding_Remove;.margin_Remove;}
  .article_body ul li{line-height:35px;.padding(2px,0px);
    //a标签样式
    & a{color:@contentColor;}
    //a标签伪类样式
    & a:hover{color: @font_blue};
  }
  //文章模块
  .article{.size(790px,auto);float: left;margin-top: 20px;.card(0,0);.padding(15px,15px);}
  .article_list{float: left;
    //套用样式,全使用后代样式
    & .focus_article_list{.padding_Remove;.size(375px,auto);.padding(10px,10px);.margin(8px,0px);
      &:hover{.radius();.shadow();}
    }
    //文章模块图片
    & .focus_article_img{.size(120px,80px);
      & img{.size(120px,80px);}
    }
    //图片右部div
    & .focus_article_text{float: right;}
    & .tx_title{.size(220px,55px);}
    //用户名+浏览量div
    & .focus_tx_attr{float: left;
      //左部用户名样式
      & .user_name{float: left;
        //用户名的a标签样式
        & a{color: @infoColor;
          &:hover{color: @font_blue;}
        }
      }
      //浏览量div
      & .attr_view{float: right;color: @infoColor;}
    }
  }

  //插入广告
  .advertising_blank{.size(820px,auto);float: left;margin-top:20px;
    & img{.size(820px,auto)};
  }

  //问答模块
  .questions{.size(790px,auto);float: left;margin-top: 20px;.card(0,0);.padding(15px,15px)}
  .questions_list{.article_list;}


  //测试模块
  .test{.size(790px,auto);float: left;margin-top: 20px;.card(0,0);.padding(15px,15px)}
  .test_list{.article_list;}


  //活动模块
  .activity{.size(790px,auto);float: left;.margin(20px,0);.card(0,0);.padding(15px,15px)}
  .activity_list{.size(180px,auto);.padding(8.75px,8.75px);float: left;
    &:hover{.shadow();.radius();}
  }
  .activity_list_top img{.size(180px,120px);;
    &:hover{opacity:0.7;background: white;}
  }
  .activity_list_bottom{.padding(10px,0px);
    & .activity_list_bottom_title{color: @titleColor;
      &:hover{color: @font_blue;};
    }
    & .activity_list_bottom_people{color: @contentColor;text-align: right;}
  }


  //右部设置
  .body_edge{.size(350px,auto);float: left;margin-left:30px;}

  //关注模块
  .edge_focus{.card(0,0);.size(330px,auto);.padding(10px,10px);float: left;}
  //关注列表的div
  .focus_article_list{.padding(10px,0px);float: left;.size(330px,auto);}
  //关注列表图片div
  .focus_article_img{float: left;.size(99px,66px);
    //关注列表里的img样式
    & img{width:99px;height:66px;float: left;
      //伪类样式
      &:hover{opacity:0.7;background: white;}
    }
  };
  //关注列表右部div
  .focus_article_text{float: left;.size(220px,auto);.padding_left(5px);}
  .tx_title{.size(215px,auto);float: left;
    //标题里面的a标签颜色
    & a{color:@titleColor;};
    //伪类样式
    & a:hover{color: @font_blue;};
  }
  //关注列表点赞用户盒子
  .focus_tx_attr{.size(215px,auto);float:left;padding-top:5px;
    //关注列表表格样式
    & .tx_attr_left{float: left;
      //表格里面的用户名样式
      & a{color: @handleColor;}
      //表格里面的用户名伪类样式
      & a:hover{color: @font_blue;}
    }
    & .tx_attr_right{color: @handleColor;float: right;}
  }
  //我懂你模块
  .edge_recommended{margin-top: 20px;}
}